$(function() {
	var headhtml = '<div id="head" class="head" style="height: 70px;" >' +
		'<div class="container">' +
		'<nav class="navbar navbar-default navbar-default-mystyle">' +
		'<div class="container-fluid">' +

		'<div class="navbar-header">' +
		'<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">' +
		'<span class="sr-only">Toggle navigation</span>' +
		'<span class="icon-bar"></span>' +
		'<span class="icon-bar"></span>' +
		'<span class="icon-bar"></span>' +
		'</button>' +
		'<img src="../img/ic_logo.png" class="img-responsive" width="60px" height="60px" style="margin-top: 4px;">' +
		'</div>' +
		'<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">' +
		'<ul id="top-ul" class="nav navbar-nav nav-mystyle">' +
		'<li class="ul-li"><a href="#">首页</a></li>' +
		'<li><a href="#">课程</a></li>' +
		'<li><a href="#">班级</a></li>' +
		'<li><a href="#">留学保障</a></li>' +
		'<li><a href="#">师资</a></li>' +
		'<li><a href="#">咨询</a></li>' +
		'</ul>' +
		'<ul class="nav navbar-nav navbar-right  hidden-xs hidden-sm hidden-md">' +
		'<li class="nav-search"><input type="text" name="" id="" value="" placeholder="请输入关键字" />' +
		'<span class="glyphicon glyphicon-search"></span>' +
		'</li>' +
		'<li><a href="#"><img class="nav-logo img-responsive" src="../img/ic_cartoon.png"></a></li>' +
		'<li><a href="#" class="study">我的学习</a></li>' +
		'<li><a href="#"><img class="img-email" src="../img/ic_email.png"></a></li>' +
		'</ul>' +
		'</div>' +
		'</div>' +
		'</nav>' +
		'</div>' +
		'</div>';
	$(".home-top").append(headhtml);

	var homefooter = '<div id="footer">' +
		'<div class="user">' +
		'<div class="container">' +
		'<div class="col-xs-3  col-xs-offset-1">' +
		'<ul>' +
		'<li class="user-li">我是学生</li>' +
		'<li><a href="##">如何注册</a></li>' +
		'<li><a href="##">如何学习</a></li>' +
		'<li><a href="##">学习卡使用说明</a></li>' +
		'</ul>' +
		'</div>' +
		'<div class="col-xs-3">' +
		'<ul>' +
		'<li class="user-li">我是老师</li>' +
		'<li><a href="##">学员问答</a></li>' +
		'<li><a href="##">学员话题</a></li>' +
		'</ul>' +
		'</div>' +
		'<div class="col-xs-3">' +
		'<ul>' +
		'<li class="user-li">课程相关</li>' +
		'<li><a href="##">全部课程</a></li>' +
		'<li><a href="##">热门课程</a></li>' +
		'<li><a href="##">免费课程</a></li>' +
		'</ul>' +
		'</div>' +
		'<div class="col-xs-2">' +
		'<ul>' +
		'<li class="user-li">我是学生</li>' +
		'<li><a href="##">我的课程</a></li>' +
		'<li><a href="##">个人设置</a></li>' +
		'<li><a href="##">账户中心</a></li>' +
		'</ul>' +
		'</div>' +
		'</div>' +
		'</div>' +
		'<div class="foot">' +
		'<span>powered by 科大教育</span>' +
		'<br />' +
		'<span>课程内容版权均归科大高新教育集团有限公司所有 陕ACP备 03557号</span>' +
		'</div>' +
		'</div>';
	$(".home-footer").append(homefooter);

	//头部点击事件
	$("#top-ul").on("click", "li", function() {
		// $(this).removeClass("active")
		$(this).addClass("ul-li").siblings().removeClass("ul-li");
		var index = $(this).index();
		console.log(index);
		switch (index) {
			case 0:
				$("#iframe").attr("src", "homepage.html");
				// $("#iframe").contentWindow.location.reload(true);
				break;
			case 1:
				$("#iframe").attr("src", "course.html");
				// $("#iframe").contentWindow.location.reload(true);
				break;
			case 2:
				$("#iframe").attr("src", "course-content.html");
				// $("#iframe").contentWindow.location.reload(true);
				break;
			case 3:
				$("#iframe").attr("src", "abroad.html");
				// $("#iframe").contentWindow.location.reload(true);
				break;
			case 4:
				$("#iframe").attr("src", "teacher.html");
				// $("#iframe").contentWindow.location.reload(true);
				break;
			case 5:
				$("#iframe").attr("src", "information.html");
				// $("#iframe").contentWindow.location.reload(true);
				break;
			default:
				break;
		}
	});

	//刷新iframe的高度
	$("#iframe").load(function() {
		var mainheight = $(this).contents().find("body").height() + 30;
		$(this).height(mainheight);
	});
});
